<template>
  <div class="app-container">
    <Find
      @handleBlur1="handleBlur1"
      :OriginalFilter="{ static: true }"
      :formList="formList"
      @findClicked="findData"
      @Launchform="Launchform5"
      @clickNumber1="clickNumber1"
    />

    <el-card style="margin-top: 10px" shadow="always" :body-style="{ padding: '5px' }">
      <div style="display: flex">
        <div style="width: 50%">
          <h1>指令查询</h1>
          <Table
            @selectList="selectList"
            @sortChange="sortChange"
            @currentRow="currentRow"
            :isLoading="isLoading"
            :selection="true"
            :tableHeader="tableHeader"
            :tableData="lotNoQueryParmsDate"
            :TableHeight="96"
          />
          <PageModule
            :PageData="{ total, pageSizeShow: true, buttonS: true }"
            :layout="'prev, pager'"
            @pageSizeChange="handleSizeChange"
            @pageChange="handleCurrentChange"
          />
        </div>
        <div style="margin-left: 10px; width: 50%">
          <h1>指令单价明细档</h1>
          <Table
            :summaryData="summaryData2"
            summary
            :isLoading="isLoading1"
            :selection="true"
            :tableHeader="tableHeader2"
            :tableData="detailEnquiryTableDate"
            :TableHeight="96"
          />
        </div>
      </div>

      <PageModule :PageData="{ pageSizeShow: true }" />
    </el-card>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'CommandUnitPriceReview'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import type { formListType } from '@/components/Find/index.vue'
import { ref, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { lotNoQuery, detailEnquiry, checkList } from '@/api/GeneralFinanceDepartment/FactoryLaborWage/CommandUnitPriceReview'

// 检核 取消检核
const checkListParms = ref<any>({
  lotNoList: [],
  checkFlag: ''
})

const selectList = (row: any) => {
  checkListParms.value.lotNoList = row.map((item: any) => {
    return item
  })
}

const checkListMethods = async () => {
  try {
    const result = await checkList(checkListParms.value)
    if (result.code === 200) {
      lotNoQueryMethods()
      JMessage.success(result.message)
    } else {
      JMessage.error(result.message)
    }
  } catch (error) {
    JMessage.error('检核出错请重试')
  }
}

const sortChange = (order: any, prop: any, column: any) => {
  switch (order) {
    case 'null': {
      lotNoQueryParms.value.sortWay = 1
      break
    }
    case 'ascending': {
      lotNoQueryParms.value.sortWay = 1
      break
    }
    case 'descending': {
      lotNoQueryParms.value.sortWay = 2
      break
    }
  }
  lotNoQueryMethods()
}

const currentRow = (row: any) => {
  detailEnquiryParms.value = row
  detailEnquiryMethods()
}

const summaryData2 = ref<any[]>([
  {
    index: 6,
    num: 0
  },
  {
    index: 7,
    num: 0
  }
])

const isLoading1 = ref(true)

// 指令单价明细档查询
const detailEnquiryParms = ref({})

const detailEnquiryTableDate = ref([])

const detailEnquiryMethods = async () => {
  isLoading1.value = true
  try {
    const result = await detailEnquiry(detailEnquiryParms.value)
    detailEnquiryTableDate.value = result.list
    summaryData2.value[0].num = result.countCutLayer
    summaryData2.value[1].num = result.count
    isLoading1.value = false
  } catch (error) {
    isLoading1.value = false
    JMessage.error('指令单价明细档查询')
  }
}

// 指令查询
const lotNoQueryParms = ref<any>({
  color: '',
  dateEnd1: '',
  dateEnd2: '',
  dateStart1: '',
  dateStart2: '',
  flag: 0,
  lotNo: '',
  pageNum: 1,
  pageSize: 40,
  sort: '',
  sortWay: '',
  style: '',
  type: '',
  vendorName: ''
})

const Launchform5 = (row: any) => {
  lotNoQueryParms.value.lotNo = row[0].inputValue
  lotNoQueryParms.value.style = row[1].inputValue
  lotNoQueryParms.value.dateStart1 = row[2].dateValue[0]
  lotNoQueryParms.value.dateEnd1 = row[2].dateValue[1]
  lotNoQueryParms.value.dateStart2 = row[3].dateValue[0]
  lotNoQueryParms.value.dateEnd2 = row[3].dateValue[1]
  lotNoQueryParms.value.type = row[4].selectValue
}

const handleBlur1 = (row: any) => {
  lotNoQueryParms.value.lotNo = row[0].inputValue
  lotNoQueryParms.value.style = row[1].inputValue
  lotNoQueryMethods()
}

const isLoading = ref(true)

const lotNoQueryParmsDate = ref([])

const lotNoQueryMethods = async () => {
  isLoading.value = true
  try {
    const result = await lotNoQuery(lotNoQueryParms.value)
    lotNoQueryParmsDate.value = result.list.map((item: any) => {
      if (item.cfmFlag === 'Y') {
        item.backgroundColor = '#00FF00'
      }

      return item
    })

    if (result.list.length !== 0) {
      detailEnquiryParms.value = result.list[0]
      detailEnquiryMethods()
    }
    total.value = result.total
    isLoading.value = false
  } catch (error) {
    JMessage.error('指令查询出错')
    isLoading.value = false
  }
}

const clickNumber1 = (row: any) => {
  switch (row) {
    case '1': {
      lotNoQueryParms.value.flag = 1
      break
    }
    case '2': {
      lotNoQueryParms.value.flag = 2
      break
    }
    case '0': {
      lotNoQueryParms.value.flag = 0
      break
    }
  }
  lotNoQueryMethods()
}

const total = ref(0)

const handleSizeChange = (val: number) => {
  lotNoQueryParms.value.pageSize = val
  lotNoQueryMethods()
}

const handleCurrentChange = (val: number) => {
  lotNoQueryParms.value.pageNum = val
  lotNoQueryMethods()
}

onMounted(() => {
  lotNoQueryMethods()
})

const formList = ref<any>([
  {
    type: 'input',
    inputPlaceholder: '指令',
    inputValue: '',
    inputWidth: '140px'
  },
  {
    type: 'input',
    inputPlaceholder: '型体',
    inputValue: '',
    inputWidth: '140px'
  },
  {
    type: 'date',
    dateLabel: '派工日期',
    dateValue: ''
  },
  {
    type: 'date',
    dateLabel: '检核日期',
    dateValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '类型',
    selectLabel: '',
    selectOptions: [
      {
        optionKey: `冲裁`,
        optionLabel: `冲裁`,
        optionValue: `冲裁`
      },
      {
        optionKey: `手工`,
        optionLabel: `手工`,
        optionValue: `手工`
      },
      {
        optionKey: `针车`,
        optionLabel: `针车`,
        optionValue: `针车`
      },
      {
        optionKey: `全部`,
        optionLabel: `全部`,
        optionValue: `全部`
      }
    ]
  },

  {
    type: 'radio1',
    checkboxLabel: '未检核',
    checked: false,
    label: '1'
  },
  {
    type: 'radio1',
    checkboxLabel: '已检核',
    checked: false,
    label: '2'
  },
  {
    type: 'radio1',
    checkboxLabel: '全部',
    checked: false,
    label: '0'
  },

  {
    type: 'button',
    checkboxLabel: '搜索'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '检核'
  },
  {
    type: 'button',
    checkboxLabel: '取消检核'
  }
])

const handleCloseMateriaLKlc5 = () => {
  ElMessageBox.confirm('确认要检核吗?')
    .then(async () => {
      checkListMethods()
    })
    .catch(() => {})
}

const handleCloseMateriaLKlc6 = () => {
  ElMessageBox.confirm('确认要取消检核吗?')
    .then(async () => {
      checkListMethods()
    })
    .catch(() => {})
}

const findData = (a: string) => {
  if (a === '置空') {
    formList.value.forEach((item: any) => {
      item.inputValue = ''
      item.dateValue = ''
      item.selectValue = ''
    })
  }
  if (a === '检核') {
    checkListParms.value.checkFlag = 1
    if (checkListParms.value.lotNoList.length === 0) {
      JMessage.warning('请勾选需要检核的数据')
    } else {
      handleCloseMateriaLKlc5()
    }
  }

  if (a === '取消检核') {
    checkListParms.value.checkFlag = 2
    if (checkListParms.value.lotNoList.length === 0) {
      JMessage.warning('请勾选需要取消检核的数据')
    } else {
      handleCloseMateriaLKlc6()
    }
  }

  if (a === '搜索') {
    lotNoQueryMethods()
  }
}

// 表格数据

const tableHeader = ref([
  {
    sortable: 'column',
    backgroundColor: true,
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '颜色',
    prop: 'color'
  },
  {
    label: '类型',
    prop: 'type'
  },
  {
    label: '单价',
    prop: 'price'
  },
  {
    label: '检核标记',
    prop: 'cfmFlag'
  }
])

const tableHeader2 = ref([
  {
    label: '类型',
    prop: 'type',
    width: 50
  },
  {
    width: 50,
    label: '序号',
    prop: 'seqNo'
  },
  {
    width: 120,
    label: '部位',
    prop: 'partName'
  },
  {
    width: 250,
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    label: '片数',
    prop: 'pieceNum'
  },
  {
    label: '层数',
    prop: 'cutLayer'
  },
  {
    label: '单价',
    prop: 'price',
    width: 50
  },
  {
    label: '备注',
    prop: 'reMark'
  }
])
</script>

<style lang="less" scoped>
h1 {
  font-size: 14px;
  margin-bottom: 5px;
}
</style>
